<template>
	<view class="setting-container">
		<uni-card class="setting-card">
			<view class="card-header">
				<uni-icons type="gear-filled" size="24" color="#2b9939"></uni-icons>
				<text class="section-title">智能体设置</text>
			</view>
			
			<uni-forms :modelValue="agent" labelWidth="120">
				<!-- 新增的只读信息 -->
				<uni-forms-item label="创建时间" labelAlign="right">
					<text class="readonly-text">{{ formatTime(agent.create_time*1000) || '--' }}</text>
				</uni-forms-item>
				
				<uni-forms-item label="智能体名称" labelAlign="right">
					<text class="readonly-text">{{ agent.bot_name || '暂无参数' }}</text>
				</uni-forms-item>

				<!-- 同步设置 -->
				<uni-forms-item label="Coze同步" labelAlign="right">
					<view class="form-item-content" style="justify-content: flex-start;"> <!-- 左对齐调整 -->
						<button class="sync-btn" @tap="syncFromCoze">
							<uni-icons type="refresh" size="14" color="#fff"></uni-icons>
							同步
						</button>
						<text class="tip-text">最后同步：{{ formatTime(agent.update_time*1000) || '从未同步' }}</text>
					</view>
				</uni-forms-item>

				<!-- 可见性设置 -->
				<uni-forms-item label="公开状态" labelAlign="right">
					<view class="form-item-content">
						<switch 
							:checked="agent.is_public" 
							color="#2b9939"
							class="status-switch"
							@change="updateVisibility"
						/>
						<text class="status-text">{{ agent.is_public ? '已公开' : '未公开' }}</text>
					</view>
				</uni-forms-item>
			</uni-forms>
		</uni-card>
	</view>
</template>

<script>
import {aiApi} from '@/utils/api.js'
export default {
	data() {
		return {
			agent: {
				is_public: 1,
				update_time:0,
			},
			lastSyncTime: null
		}
	},
	onLoad(op){
		if(op.id){
			this.agent.id = op.id
			this.getAgentInfo()
		}
	},
	methods: {

		// 时间戳转换
		formatTime(timeStamp) {
			if(timeStamp === 0 ){return null}
			const date = new Date(timeStamp)
			const year = date.getFullYear()
			const month = String(date.getMonth() + 1).padStart(2, '0')
			const day = String(date.getDate()).padStart(2, '0')
			const hours = String(date.getHours()).padStart(2, '0')
			const minutes = String(date.getMinutes()).padStart(2, '0')
			const seconds = String(date.getSeconds()).padStart(2, '0')
			return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`	
		},

		// 获取智能体信息
		getAgentInfo(){
			// aiApi.getAgentInfo({
			// 	bot_id: this.agent.bot_id
			// }).then(res=>{
			// 	this.agent = res
			// 	this.lastSyncTime = res.last_sync_time
			// })
			// 获取智能体信息...
			aiApi.getAgentInfoByAgentId({
				agent_id: this.agent.id
			}).then(res=>{
				this.agent = res.data;
				
			})
		},
		syncFromCoze() {
			uni.showLoading({ title: '同步中...' })
			aiApi.syncAgentInfo({
				agent_id: this.agent.id	
			}).then(res=>{
				uni.hideLoading()
				this.lastSyncTime = res.update_time
				this.getAgentInfo()
			})
			// 同步逻辑...
		},
		updateVisibility(e) {
			this.agent.is_public = e.detail.value ? 1 : 0
			aiApi.setAgentIsPublic({
				is_public: this.agent.is_public,
				agent_id:this.agent.id
			})
			// 更新接口...
		}
	}
}
</script>

<style>
.setting-container {
	padding: 20rpx;
	background: #f5f7fa;
}

.setting-card {
	border-radius: 16rpx;
	box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.08);
}

.card-header {
	display: flex;
	align-items: center;
	padding-bottom: 20rpx;
	border-bottom: 1rpx solid #eee;
	margin-bottom: 30rpx;
}

.section-title {
	font-size: 32rpx;
	color: #2b9939;
	margin-left: 12rpx;
}

.sync-btn {
	background: linear-gradient(45deg, #2b9939, #67c23a);
	color: #fff;
	width: 170rpx;
	border-radius: 50rpx;
	padding: 8rpx 24rpx;  /* 减少内边距 */
	font-size: 24rpx;     /* 缩小字体 */
	display: inline-flex;
	align-items: center;
}

/* 调整图标尺寸 */
.sync-btn .uni-icons {
	margin-right: 6rpx;   /* 缩小图标间距 */
	font-size: 14px !important; /* 统一图标大小 */
}

.tip-text {
	color: #909399;
	font-size: 24rpx;
	margin-left: 20rpx;
}

.status-switch {
	transform: scale(0.8);
}

.status-text {
	color: #606266;
	margin-left: 15rpx;
}

.form-item-content {
	display: flex;
	align-items: center;
}

.readonly-text {
  color: #909399;
  font-size: 28rpx;
  background: #f5f7fa;
  padding: 12rpx 20rpx;
  border-radius: 8rpx;
}
</style>
